<html>

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <meta name="format-detection" content="telephone=no" />
    <title>更多消息</title>
    <link rel="stylesheet" href="../../css/reset.css">
    <style>
        body {
            width: 100%;
            background-color: #fff;
            font-size: 0.26rem;
            box-sizing: border-box;
            -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
            font-family: Helvetica;
            color: #333333;
        }

        .addBankCard {
            width: 100%;
            padding-left: 0.3rem;
            box-sizing: border-box;
        }

        .addBankCard li {
            width: 100%;
            height: 1.43rem;
            display: flex;
            display: -webkit-flex;
            justify-content: space-between;
            align-items: center;
            padding-right: 0.4rem;
            box-sizing: border-box;
            border-bottom: 1px solid #e2e2e2;
        }

        .addBankCard li div {
            flex: 1;
        }

        .addBankCard li div p {
            margin-bottom: 0.2rem;
            font-size: 0.28rem;
        }

        .addBankCard li div span {
            color: #ababab;
        }
    </style>
</head>

<body>
    <div class="showbanK">
        <ul class="addBankCard">
        </ul>
        <div id="listState" style="width: 100%;text-align: center;padding: 0.2rem 0;">
        </div>
    </div>
</body>

<script src="../../script/autosize.js"></script>
<script src="../../script/fastclick.js"></script>
<script src="../../script/jquery_three_two_one.js"></script>
<script src="../../script/dotmin.js"></script>
<script src="../../script/app.js"></script>
<script>
    apiready = function () {
        var app = new APP();
        var account = app.getAccount();
        var curPage = 1;
        var totalPage = 0;
        var strRegex = '^((https|http|ftp|rtsp|mms)?://)' +
            '?(([0-9a-z_!~*\'().&=+$%-]+: )?[0-9a-z_!~*\'().&=+$%-]+@)?' //ftp的user@ 
            +
            '(([0-9]{1,3}.){3}[0-9]{1,3}' // IP形式的URL- 199.194.52.184 
            +
            '|' // 允许IP和DOMAIN（域名） 
            +
            '([0-9a-z_!~*\'()-]+.)*' // 域名- www. 
            +
            '([0-9a-z][0-9a-z-]{0,61})?[0-9a-z].' // 二级域名 
            +
            '[a-z]{2,6})' // first level domain- .com or .museum 
            +
            '(:[0-9]{1,4})?' // 端口- :80 
            +
            '((/?)|' // a slash isn't required if there is no file name 
            +
            '(/[0-9a-z_!~*\'().;?:@&=+$,%#-]+)+/?)$';
        var reTest = new RegExp(strRegex);
        var lists = [];

        function getMoreMessge(curPage, isdown) {
            app.ajaxPro({
                url: "broadcast/lists",
                values: {
                    release_location: 1,
                    page: curPage,
                    pageSize: "20"
                },
                openFlower: true
            }, function (ret) {
                if (ret.code == 200) {
                    totalPage = ret.data.total_page;
                    var arrList = ret.data.list;
                    arrList.map(function (item) {
                        if (item.title.length > 10) {
                            item.title = item.title.slice(0, 10) + "……";
                        }
                        if (!reTest.test(item.content)) {
                            item.content = JSON.stringify(item.content);
                        }
                    })
                    // 渲染模板
                    var temp = doT.template($("#bankList").text());
                    if (isdown) {
                        lists = arrList;
                    } else {
                        for (var i = 0; i < arrList.length; i++) {
                            lists.push(arrList[i]);
                        }
                    }
                    $(".addBankCard").html(temp(lists));
                    $(".addBankCard").on("click", "li", function () {
                        var thisindex = $(this).index();
                        var getUrlCentant = lists[thisindex].content;
                        var getTypetitle = lists[thisindex].type;
                        var getTitle = lists[thisindex].title;
                        if (getTypetitle == 2) {
                            var goCerfition = {
                                name: "moreMessageDeatail",
                                url: getUrlCentant,
                                title: getTitle.length > 10 ? (getTitle.substring(0, 10) + "…") : getTitle
                            }
                            app.setNavBarAttrPrimary(goCerfition);
                        } else {
                            var pageValue = {
                                name: "word_cont_one",
                                subpage: "extrapage/word_cont_one",
                                title: getTitle.length > 10 ? (getTitle.substring(0, 10) + "…") : getTitle,
                                param: {
                                    pageName: "word_cont_one",
                                    content: getUrlCentant
                                }
                            }
                            app.setNavBarAttr(pageValue);
                        }
                    })
                    if (curPage == 1 && arrList.length == 0) {
                        $("#listState").text("暂时没有相关数据");
                    }
                }
            })
        }
        getMoreMessge(curPage, true);
        // 监听滚动到底部
        app.toBottom(function () {
            if (curPage < totalPage) {
                curPage++;
                getMoreMessge(curPage, false);
            }
        });
        // 设置可以下拉加载
        app.downRefresh(function () {
            $(".addBankCard").empty();
            curPage = 1;
            totalPage = 0;
            getMoreMessge(curPage, true);
        });
        app.headerMap();
    }
</script>
<script type="text/html" id="bankList">
{{~it:value:index}}
<li>
    <div>
        <p>
            {{=value.title}}
        </p>
        <span>
            {{=value.create_time}}
        </span>
    </div>
    <img src="../../image/rightjt.png" style="width: 0.1rem;height:0.18rem;">
</li>
{{~}}
</script>

</html>